<template>
  <div id="app">
    <header class="head">
      <a class="back tl" href="javascript:history.back(-1)">
        <i class="el-icon-arrow-left"></i>
      </a>
      <a href="javascript:;" class="tc">
        <small class="font_18 co_f">门市卖场详情</small>
      </a>
    </header>
    <main>
      <section class="detail_status_info" v-if="this.$route.query.key==1">
        <header><span>基本信息</span></header>
        <p><label>门市门店名称</label><span>{{this.listData.fld_3}}</span></p>
        <p><label>详细坐落地：</label><span>{{this.listData.fld_4}}</span></p>
        <p>
          <label>关联房产：</label>
          <span>
            <ul class="relation">
              <li  v-for="item in newitems" >
                  <router-link :to='{name: "HouseArchivesdetail",query:{unid:item.unid}}'>
                      <img src="../../../img/house.png"  class="houseimg"/>{{item.name}}
                  </router-link>
              </li>
            </ul>
             </span>
        </p>
        <p><label>所属部门(分公司)：</label><span>{{this.listData.fld_5}}</span></p>
        <p><label>总面积(m²):</label><span>{{this.listData.fld_11}}</span></p>
        <p><label>自营面积(m²):</label><span>{{this.listData.fld_12}}</span></p>
        <p><label>联营面积(m²):</label><span>{{this.listData.fld_15}}</span></p>
        <p><label>出租面积(m²):</label><span>{{this.listData.fld_16}}</span></p>
        <p><label>门市内办公场所面积(m²):</label><span>{{this.listData.fld_14}}</span></p>
        <p><label>门市内仓库面积(m²):</label><span>{{this.listData.fld_30}}</span></p>
        <p><label> 门市内其他房产面积(m²):</label><span>{{this.listData.fld_17}}</span></p>
        <p><label>  卖场所在层数 (m²):</label><span>{{this.listData.fld_13}}</span></p>
      </section>
       <section class="detail_status_info"  v-if="this.$route.query.key==2">
        <header><span>基本信息1</span></header>
        <p><label>门市门店名称</label><span>{{this.listData.values[4]}}</span></p>
        <p><label>详细坐落地：</label><span>{{this.listData.values[5]}}</span></p>
        <p>
          <label>关联房产：</label>
          <span>
            <ul class="relation">
              <li  v-for="item in namenewitems" >
                  <router-link :to='{name: "HouseArchivesdetail",query:{unid:item.unid}}'>
                      <img src="../../../img/house.png"  class="houseimg"/>{{item.name}}
                  </router-link>
              </li>
            </ul>
             </span>
        </p>
        <p><label>所属部门(分公司)：</label><span>{{this.listData.values[6]}}</span></p>
        <p><label>总面积(m²):</label><span>{{this.listData.values[11]}}</span></p>
        <p><label>自营面积(m²):</label><span>{{this.listData.values[12]}}</span></p>
        <p><label>联营面积(m²):</label><span>{{this.listData.values[13]}}</span></p>
        <p><label>出租面积(m²):</label><span>{{this.listData.values[14]}}</span></p>
        <p><label>门市内办公场所面积(m²):</label><span>{{this.listData.values[15]}}</span></p>
        <p><label>门市内仓库面积(m²):</label><span>{{this.listData.values[16]}}</span></p>
        <p><label> 门市内其他房产面积(m²):</label><span>{{this.listData.values[17]}}</span></p>
        <p><label>  卖场所在层数 (m²):</label><span>{{this.listData.values[18]}}</span></p>
      </section>
    </main>
  </div>
</template>

<script>
  import {
    ViewDetail,ViewDetail2
  } from '../../../api/api';
  export default {
    data() {
      return {
        listData: {},
         newitems:[],
         namenewitems:[],
         name: this.$route.query.name,
         unid: this.$route.query.unid
      };
    },
    methods: {
      getData() {
  
          let options = {
                  params: {
                    unid: this.$route.query.unid,
                  }
                }
        //调取接口
        ViewDetail(options).then((res) => {
          this.listData = res.fields
            this.items=res.fields.fld_18.split('、')
          for(let i=0;i<this.items.length;i++){
            this.name=this.items[i].split("|")[0];
            this.unid=(this.items[i].split("|")[1]).split(".")[0];
            this.newitems.push({name:this.name,unid:this.unid})
          }
        })
      },
       getData1() {
          let options = {
                  params: {
                    name: this.$route.query.name,
                  }
                }
        //调取接口
        ViewDetail2(options).then((res) => {
          this.listData = res.viewEntries[0]
            this.items=res.viewEntries[0].values[19].split('、')
          for(let i=0;i<this.items.length;i++){
            this.name=this.items[i].split("|")[0];
            this.unid=(this.items[i].split("|")[1]).split(".")[0];
            this.namenewitems.push({name:this.name,unid:this.unid})
          }
        })
      }
    },
    mounted() {
      this.getData();
      this.getData1();
    }
  }
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->

<style lang="scss" scoped>
  
</style>
